import React from "react";
import RollbackForm from 'components/rollbackForm';
import SearchTable from "components/searchTable/SearchTable.jsx";
import { openNotificationWithIcon } from "utils/comm";
import { connect } from "dva";
import Base from "./components/Base";

const emptyParams = {
  modelName: '',
  applyUserName: '', // 申请人
  serialNum: '',
  taskName: '',
}
@connect(({
  FlowHandle, loading, appListMenu, Public,
}) => ({
  flowHandleStore: FlowHandle, loading,
  focusApp: appListMenu.focusApp,
  menuDataList: Public.menuDataList,
  resourceList: Public.resourceList,
}))export default class Todo extends Base {
  state = {
    page: {
      pageNum: 1,
      pageSize: 10,
    },
    rollbackVisible: false,
  }

  openNotificationWithIcon = openNotificationWithIcon.bind(this);

  searchParams = emptyParams;

  componentDidMount() {
    this.initData();
  }

  componentDidUpdate(preProps) {
    const { focusApp } = this.props;
    const { focusApp: preFocusApp } = preProps;
    if (preFocusApp.id && `${preFocusApp.id || 0}` !== `${focusApp.id || 0}`) {
      // 应用切换更新页面数据
      this.resetPageData();
    }
  }

  resetPageData = () => {
    const { dispatch } = this.props;
    this.searchParams = emptyParams;
    if (this.tableForm) {
      this.tableForm.handleReset();
    }
    dispatch({ type: "FlowHandle/clearData" });
    this.setState({
        page: { pageNum: 1, pageSize: 10 },
      }, () => {
        this.initData();
      }
    );
  }
  
  // 签收
  handleTaskclaim = (record = {}) => {
    const { dispatch } = this.props;
    const { taskId } = record;
    dispatch({ type: "FlowHandle/handleTaskclaim", payload: { taskId } }).then(({ errCode }) => {
      if (errCode === 0) {
        this.handleSearch(emptyParams);
      }
    });
  }

  // 退回弹窗
  handleRollbackVisible = (visible, record = '', isQuery = false) => {
    const { taskId } = record || {};
    this.record = record;
    this.taskId = taskId;
    this.setState({ rollbackVisible: visible });
    if (isQuery) {
      this.handleSearch();
    }
  }

  render() {
    const { rollbackVisible } = this.state;
    const { loading, dispatch } = this.props;
    // const confirmLoading = loading.effects['FlowHandle/handleTask'];
    // const formLoading = loading.effects['FlowHandle/getTaskform'];
    const rollbackLoading = loading.effects['FlowHandle/handleTaskRollback'];
    return (
      <>
        <SearchTable
          ref={r => {
            if (r) {
              this.tableForm = r;
            }
          }}
          formConfig={this.getFormConfig()}
          handleSearch={this.handleSearch}
          tableProps={this.getAntTableProps()}
        />
        {rollbackVisible && (
          <RollbackForm
            visible={rollbackVisible}
            confirmLoading={rollbackLoading}
            onCancel={this.handleRollbackVisible}
            dispatch={dispatch}
            data={this.record}
          />
        )}
      </>
    );
  }
}
